<template>
    <div style="border: 3px solid SaddleBrown;">
        <h2>父元素(Father)</h2>
        <input type="text" v-model="fatherData">
        <h3>父元素数值:{{fatherData}}</h3>
        <br>
        <h3>子向父传递事件:{{sonData}}</h3>
        <h3>使用.sync绑定值:{{fatherDataTwoA}}</h3>
        <Son :father-data="fatherData" :father-data-two.sync="fatherDataTwoA"
             @son-data="sonDataChenge">
        </Son>
        <Button type="primary" @click="timer()">开始</Button>
        <Button type="primary" @click="end()">结束</Button>
        <Button type="primary" @click="moUpdata()">修改引入模块值</Button>
    </div>
</template>

<script>
import Son from './son.vue';
import mo from './module'

export default {
    name: "Father",
    components: { Son },
    props: ['open', 'end', 'fun'],
    data() {
        return {
            fatherData: '1',
            fatherDataTwoA: '1',
            sonData: 1
        }
    },
    mounted() {
        console.log(this.fun(this.fatherData));
    },
    methods: {
        sonDataChenge(e) {
            this.sonData = e
        },
        timer() {
            const abc = setInterval(function (params) {
                console.log(111);
            }, 1000)
            this.$store.commit('startTimer', abc)
        },
        moUpdata() {
            mo.abc++
        }
    }
};
</script>

<style lang="less" scoped>
</style>
